import { IconProps } from '../../icon.types'

type Props = Omit<IconProps, 'name' | 'color'>

const EmojiSmile: React.FC<Props> = ({ width = '30', height = '30', onClick }) => {
  return (
    <svg
      width={width}
      height={height}
      viewBox="0 0 61 61"
      fill="none"
      xmlns="http://www.w3.org/2000/svg"
      onClick={onClick}
    >
      <g filter="url(#filter0_d_1752_3528)">
        <rect
          x="0"
          y="0"
          width="60"
          height="60"
          fill="url(#emoji_smile)"
          shapeRendering="crispEdges"
        />
      </g>
      <defs>
        <filter
          id="filter0_d_1752_3528"
          x="0"
          y="0.449707"
          width="60.1321"
          height="60.1321"
          filterUnits="userSpaceOnUse"
          colorInterpolationFilters="sRGB"
        >
          <feFlood floodOpacity="0" result="BackgroundImageFix" />
          <feColorMatrix
            in="SourceAlpha"
            type="matrix"
            values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
            result="hardAlpha"
          />
          <feOffset />
          <feGaussianBlur stdDeviation="8" />
          <feComposite in2="hardAlpha" operator="out" />
          <feColorMatrix
            type="matrix"
            values="0 0 0 0 1 0 0 0 0 0.8 0 0 0 0 0.301961 0 0 0 0.31 0"
          />
          <feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_1752_3528" />
          <feBlend
            mode="normal"
            in="SourceGraphic"
            in2="effect1_dropShadow_1752_3528"
            result="shape"
          />
        </filter>
        <pattern id="emoji_smile" patternContentUnits="objectBoundingBox" width="1" height="1">
          <use xlinkHref="#image0_1752_3528" transform="scale(0.00625)" />
        </pattern>
        <image
          id="image0_1752_3528"
          width="160"
          height="160"
          xlinkHref=""
        />
      </defs>
    </svg>
  )
}

export default EmojiSmile
